<template>
	<view class="text-df">
		<view v-for="(item, index) in notice" :key="index" class="margin-top-sm  padding-lr-com"
			@click="to_detail(item.id)">
			<view class="flex-row-bt margin-bottom-xs">
				<view class="text-mid">捐赠编号: <text class="text-sm">{{item.donationNumber}}</text></view>
				<!-- <view v-if="item.itemStatus=='0'" class="theme-color">待分配</view>
				<view v-if="item.itemStatus=='1'" class="">已接受</view>
				<view v-if="item.itemStatus=='2'" class="text-mid">已使用</view> -->
			</view>
			<view class="flex-row-bt">
				<view class="flex-row-st">
					<image :src="imgURL+item.indexImg" style="width: 160rpx; height: 160rpx;" mode="aspectFill"
						class="border-radius-xs">
					</image>
					<view class="margin-left-xs" style="width: 365rpx;">
						<view class=" ">
							<text class="text-sm text-mid">捐赠人：</text>
							<text class="text-df" v-if="item.donateName==null">匿名捐赠</text>
							<text v-for="i in item.donateName" class="text-df" v-else>{{i}}</text>
						</view>
						<view class=" margin-top-xs">
							<text class="text-sm text-mid">物品捐赠：</text>
							<text class="">{{item.donations}}</text>
						</view>
						<view class="text-sm margin-top-xs">{{item.createTime.slice(0,10)}}</view>
					</view>
				</view>
				<view style="text-align: center">
					<view class="text-xl text-bold theme-color">￥{{item.totalPrice.value}}<text class="text-sm"
							style="margin-left: 2rpx;">{{item.totalPrice.unit}}</text></view>
					<view class="text-sm text-mid margin-top-xs">价值</view>
				</view>
			</view>
		</view>

		<!-- 分割线 -->
		<divider marginTop="40px" marginBottom="40px"></divider>
	</view>
</template>

<script lang="ts" setup>
	import { reactive, ref } from 'vue';
	import { imgURL } from '../../api/request';
	import { onLoad, onReachBottom } from "@dcloudio/uni-app"
	import { getDonateList } from '../../api/notice/notice';

	//慈善慈善
	const notice = ref([{
		"id": "6",
		"donationNumber": "pxszf20240409101552",
		"indexImg": "/profile/product/2024/04/03/Snipaste_2024-04-03_14-53-05_20240403145423A020.png",
		"donateName": "萍乡市政府",
		"itemStatus": "0",
		"createTime": "2024-04-09 10:15:52",
		"totalPrice": "32150.00",
		"donations": "衣物(500), 书本(200)"
	}])

	//请求数据
	const param = reactive({
		current: 1,
		size: 4
	})

	//后端数据条数
	const page = ref(0)

	onLoad(() => {
		notice.value = []
		//捐赠列表
		getList()
	})

	// 触底刷新
	onReachBottom(() => {
		if (notice.value.length < page.value) {
			param.current++
			getList()
		}
	})

	//捐赠列表
	const getList = () => {
		getDonateList(param).then((res : any) => {
			if (res.code == 200) {
				page.value = res.data.total
				for (let i = 0; i < res.data.list.length; i++) {
					res.data.list[i].totalPrice = formatPrice(Number(res.data.list[i].totalPrice))
					notice.value.push(res.data.list[i])
				}
			}
		})
	}

	//价值转换
	const formatPrice = (value : number) => {
		var param = {
			unit: '',
			value: 0
		};
		var k = 10000,
			sizes = ['', '万', '亿', '万亿'],
			i;
		if (value < k) {
			param.value = value
			param.unit = ''
		} else {
			i = Math.floor(Math.log(value) / Math.log(k));
			param.value = ((value / Math.pow(k, i))).toFixed(2);
			param.unit = sizes[i];
		}
		console.log(param)
		return param;
	}

	//跳转详情
	const to_detail = (id) => {
		uni.navigateTo({
			url: '/pages/notice/detail?id=' + id
		})
	}
</script>

<style lang="scss">
	page {
		background-color: #fff;
	}
</style>